<!doctype html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>回执-司法厅</title>
    <link href="/static/css/main-page/g-reset.css" rel="stylesheet" type="text/css"/>
    <script src="/webjars/miniui/boot.js" type="text/javascript"></script>
    <script src="/static/js/common/common.js" type="text/javascript"></script>
    <style>
        body {
            height: 100%;
        }

        td.discell {
            text-align: left;
        }

        .dialog-box {
            padding: 10px 20px;
            overflow: hidden;
        }

        .dialog-box > li {
            width: 80%;
            float: left;
            margin: 5px 0;
        }

        .dialog-box > li.currentUser-wrap {
            float: right;
        }

        .dialog-box > li > div {
            position: relative;
        }

        .dialog-box > li.currentUser-wrap > div {
            text-align: right;
        }

        .send-time {
            font-size: 12px;
            line-height: 18px;
            color: #919191;
            padding: 0 10px;
        }

        .dialog-box > li > ul {
            float: left;
            background: #DCDFE6;
            color: #000;
            position: relative;
            padding: 10px;
            max-width: 380px;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
        }

        .dialog-box > li.currentUser-wrap > ul {
            float: right;
            background: #4A89FD;
            color: #fff;
            position: relative;
        }

        .dialog-box > li > ul:before {
            content: "";
            position: absolute;
            top: 10px;
            left: -10px;
            height: 0;
            width: 0;
            border: 5px solid #DCDFE6;
            border-left-color: transparent;
            border-top-color: transparent;
            border-bottom-color: transparent;
        }

        .dialog-box > li.currentUser-wrap > ul:before {
            content: "";
            position: absolute;
            top: 10px;
            left: 100%;
            height: 0;
            width: 0;
            border: 5px solid #4A89FD;
            border-right-color: transparent;
            border-top-color: transparent;
            border-bottom-color: transparent;
        }
    </style>
</head>
<body>
<form id="form1" method="post" style="height:100%;width: 100%;overflow-x: auto;overflow-y: auto;">
    <!-- 用户 编辑框START-->
    <div id="editform" class="form mini-fit" style="margin-bottom: 88px;overflow-y: auto;">
        <#--唯一标识id-->
        <input name="id" id="id" class="mini-hidden" style="width: 100%;" value="${id!''}" readonly/>
        <#--罪犯编号-->
        <input name="priNum" id="priNum" class="mini-hidden" style="width: 100%" value="${priNum!''}" readonly/>
        <#--唯一标识xjid-->
        <input name="xjrctId" id="xjrctId" class="mini-hidden" style="width: 100%;" value="${xjrctId!''}" readonly />

        <ul class="dialog-box">
        </ul>

    </div>
    <div style="position: absolute;bottom:0;width:100%;height: 88px;border-top:1px solid #dfdfdf;text-align: center">
        <table style="height: 100%;width:100%">
            <tr>
                <td class="discell"><font color="#dc143c">*</font>司法厅联系人：</td>
                <td class="input">
                    <input width="100%" class="mini-textbox" required="true" emptyText="请输入..." id="Receiver"
                           name="Receiver"
                           value="${username}"/>
                </td>
                <td class="discell">司法厅手机号码：</td>
                <td>
                    <input width="100%" class="mini-textbox" emptyText="请输入手机号码" id="ReceiverTel"
                           name="ReceiverTel"
                           onblur="checkPhone(2)" value="${phone}"/>
                </td>
                <td class="discell">司法厅固话：</td>
                <td>
                    <input width="100%" class="mini-textbox" emptyText="请输入固定电话" id="ReceiverGu"
                           name="ReceiverGu"
                           onblur="checkPhone(1)" value="${tel!''}"/>
                </td>
                <td align="center" width="120" rowspan="2">
                    <a style="margin-bottom: 10px;" class="mini-button" iconCls="fa-save" onclick="sendMessage()">发送</a>
                    <a class="mini-button" iconCls="fa-refresh" onclick="getDialogList()">刷新</a>
                </td>
            </tr>
            <tr>
                <td class="discell"><font color="#dc143c">*</font>内容：</td>
                <td colspan="3">
                    <input width="100%" class="mini-textarea" required="true" emptyText="请输入..." id="message"
                           name="message"/>
                </td>
                <input id="fhfs" name="fhfs" class="mini-hidden" value="${fhfs}"/>
            </tr>
        </table>
    </div>
</form>

<script type="text/javascript">
    mini.parse();
    var form = new mini.Form("form1");
    var priNum = $('#priNum').val();

    // 发送消息按钮
    function sendMessage() {
        var Receiver = mini.get('Receiver');
        var ReceiverTel = mini.get('ReceiverTel');
        var ReceiverGu = mini.get('ReceiverGu');
        var msg = mini.get('message');
        // 验证表单必填项
        form.validate();
        if (form.isValid() == false) {
            return;
        }
        // 手机号和固话2选1
        var newPhone = checkTelAndPhone(ReceiverGu.getValue(),ReceiverTel.getValue());
        var flag = newPhone['flag'];
        var kflag = newPhone['kflag'];
        if ('-1' === kflag) {
            mini.alert("请至少输入一个联系方式");
            return;
        }
        if (flag) {
        } else {
            mini.alert("手机号码或固话有误，请重填");
            return;
        }
        // 获取输入框的值
        var liaisonMan = Receiver.getValue();
        var liaisonPhone = ReceiverTel.getValue();
        var liaisonGu = ReceiverGu.getValue();
        var message = msg.getValue();
        // 对话框中追加对话信息
        var sendMessage = '<li class="currentUser-wrap">\n' +
            '                <div>司法厅</div>\n' +
            '                <ul>\n' +
            '                    <li>联系人：' + liaisonMan + '</li>\n' +
            '                    <li>司法厅手机号码：' + liaisonPhone + '</li>\n' +
            '                    <li>司法厅固话：' + liaisonGu + '</li>\n' +
            '                    <li>内容：' + message + '</li>\n' +
            '                </ul>\n' +
            '            </li>';
        $('.dialog-box').append(sendMessage);
        $("#editform").scrollTop($("#editform")[0].scrollHeight);

        var postData = {
            priNum: priNum,
            liaisonMan: liaisonMan,
            liaisonPhone: liaisonPhone + "|" + liaisonGu,
            message: message,
            xjrctId: "${xjrctId}"
        };
        postData = mini.encode(postData);
        $.ajax({
            url: '/azbj/yazgl/xj/hz/savemessage',
            type: 'POST',
            datatype: 'json',
            data: {data: postData},
            success: function (data) {
                Receiver.setValue(data.data.userDTO.username);
                ReceiverTel.setValue(data.data.userDTO.phone);
                ReceiverGu.setValue(data.data.userDTO.telphone);
                msg.setValue();
                // 发送成功后获取所有对话记录
                getDialogList();
            },
            error: function (status) {
                mini.alert("发送异常")
            }
        })
    }

    // 查询全部回执对话消息
    function getDialogList() {
        var xjrctId = mini.get('xjrctId').getValue();
        var dialogStr = '';
        var fhfs = mini.get("fhfs").getValue();
        $.ajax({
            url: '/azbj/xj/hz/listMessages?priNum=' + priNum + "&xjrctId="+ xjrctId,
            type: 'GET',
            datatype: 'json',
            success: function (data) {
                data = JSON.parse(data);
                if (data.length) {
                    // 会话方标识1监狱,2司法所,3看守所,5社矫,6司法厅,7地市司法局,8区县司法局
                    for (var i = 0, len = data.length; i < len; i++) {
                        if (1 == data[i].ownerFlag) {
                            dialogStr += '<li>';
                            dialogStr += '<div><span class="send-time">' + data[i].createTime + '</span>' + data[i].liaisonMan + '</div>';
                            dialogStr += '<ul>';
                            dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                            dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                            dialogStr += '<li>监所固话：' + data[i].liaisonTel + '</li>';
                            dialogStr += '<li>内容：' + data[i].message + '</li>';
                            dialogStr += '</ul>';
                            dialogStr += '</li>';
                        } else if (3 == data[i].ownerFlag) {
                            dialogStr += '<li>';
                            dialogStr += '<div>' + data[i].liaisonMan + '<span class="send-time">' + data[i].createTime + '</span></div>';
                            dialogStr += '<ul>';
                            dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                            dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                            dialogStr += '<li>看守所固话：' + data[i].liaisonTel + '</li>';
                            dialogStr += '<li>内容：' + data[i].message + '</li>';
                            dialogStr += '</ul>';
                            dialogStr += '</li>';
                        } else if (5 == data[i].ownerFlag) {
                            dialogStr += '<li>';
                            dialogStr += '<div>' + data[i].liaisonMan + '<span class="send-time">' + data[i].createTime + '</span></div>';
                            dialogStr += '<ul>';
                            dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                            dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                            dialogStr += '<li>社矫固话：' + data[i].liaisonTel + '</li>';
                            dialogStr += '<li>内容：' + data[i].message + '</li>';
                            dialogStr += '</ul>';
                            dialogStr += '</li>';
                        } else if (2 == data[i].ownerFlag) {
                            dialogStr += '<li>';
                            dialogStr += '<div><span class="send-time">' + data[i].createTime + '</span>' + data[i].liaisonMan + '</div>';
                            dialogStr += '<ul>';
                            dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                            dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                            dialogStr += '<li>司法所固话：' + data[i].liaisonTel + '</li>';
                            dialogStr += '<li>内容：' + data[i].message + '</li>';
                            dialogStr += '</ul>';
                            dialogStr += '</li>';
                        } else if (8 == data[i].ownerFlag) {
                            dialogStr += '<li>';
                            dialogStr += '<div><span class="send-time">' + data[i].createTime + '</span>' + data[i].liaisonMan + '</div>';
                            dialogStr += '<ul>';
                            dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                            dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                            dialogStr += '<li>区县司法局固话：' + data[i].liaisonTel + '</li>';
                            dialogStr += '<li>内容：' + data[i].message + '</li>';
                            dialogStr += '</ul>';
                            dialogStr += '</li>';
                        } else if (7 == data[i].ownerFlag) {
                            dialogStr += '<li>';
                            dialogStr += '<div><span class="send-time">' + data[i].createTime + '</span>' + data[i].liaisonMan + '</div>';
                            dialogStr += '<ul>';
                            dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                            dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                            dialogStr += '<li>地市司法局固话：' + data[i].liaisonTel + '</li>';
                            dialogStr += '<li>内容：' + data[i].message + '</li>';
                            dialogStr += '</ul>';
                            dialogStr += '</li>';
                        } else if (6 == data[i].ownerFlag) {
                            dialogStr += '<li class="currentUser-wrap">';
                            dialogStr += '<div><span class="send-time">' + data[i].createTime + '</span>' + data[i].liaisonMan + '</div>';
                            dialogStr += '<ul>';
                            dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                            dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                            dialogStr += '<li>司法厅固话：' + data[i].liaisonTel + '</li>';
                            dialogStr += '<li>内容：' + data[i].message + '</li>';
                            dialogStr += '</ul>';
                            dialogStr += '</li>';
                        }
                    }
                } else {
                    dialogStr = "<div style='padding: 50px 0 0;text-align: center;font-size: 18px;'>暂无回执消息</div>"
                }
                $('.dialog-box').html(dialogStr);
                $("#editform").scrollTop($("#editform")[0].scrollHeight);
            }
        })
    }

    function checkPhone(e) {
        var phone = mini.get('ReceiverTel').getValue();
        var telPhone = mini.get('ReceiverGu').getValue();
        if (e == '1') {
            if(!validateTel(telPhone)) {
                mini.alert("固定电话有误，请重填");
            }
        }
        if (e == '2') {
            if(!validatePhone1(phone)) {
                mini.alert("手机号码有误，请重填");
            }
        }
    }

    // 页面一加载
    $(function () {
        getDialogList()
    })
</script>
</body>
</html>